You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
106 lines
4.0 KiB
106 lines
4.0 KiB
import Link from "next/link";
|
|
import { type BillingInvoices, getBillingInvoices, getViewerSession } from "@/lib/popiart-api";
|
|
import { type Locale } from "@/lib/site-content";
|
|
|
|
export default async function BillingSuccessPage({
|
|
params,
|
|
searchParams,
|
|
}: {
|
|
params: Promise<{ locale: string }>;
|
|
searchParams: Promise<{ kind?: string; provider?: string; trade_no?: string }>;
|
|
}) {
|
|
const { locale } = await params;
|
|
const { kind, provider, trade_no: tradeNo } = await searchParams;
|
|
const typedLocale = locale as Locale;
|
|
const isZh = typedLocale === "zh";
|
|
const session = await getViewerSession();
|
|
let invoices: BillingInvoices | null = null;
|
|
|
|
if (session && tradeNo) {
|
|
try {
|
|
invoices = await getBillingInvoices({ keyword: tradeNo, page: 1, pageSize: 10 });
|
|
} catch {
|
|
invoices = null;
|
|
}
|
|
}
|
|
|
|
const matchedOrder =
|
|
(invoices?.subscription_orders.items || []).find((item) => String(item.trade_no || "") === String(tradeNo || "")) ||
|
|
(invoices?.point_orders.items || []).find((item) => String(item.trade_no || "") === String(tradeNo || ""));
|
|
|
|
return (
|
|
<div className="page-stack">
|
|
<section className="section-panel hero-tight">
|
|
<div className="section-heading">
|
|
<div className="eyebrow">{isZh ? "PAYMENT" : "PAYMENT"}</div>
|
|
<h1>{isZh ? "支付已完成" : "Payment completed"}</h1>
|
|
<p>
|
|
{isZh
|
|
? "订单状态已切换为成功。你可以继续回到控制台或账单中心查看最新订阅、积分和订单历史。"
|
|
: "The order has completed successfully. Continue to the console or billing center to review the latest subscription, credits, and order history."}
|
|
</p>
|
|
</div>
|
|
</section>
|
|
|
|
<section className="console-surface-card">
|
|
<div className="section-heading compact">
|
|
<h2>{isZh ? "支付结果" : "Payment result"}</h2>
|
|
</div>
|
|
<div className="table-list">
|
|
<div className="table-row">
|
|
<div>
|
|
<strong>{isZh ? "订单类型" : "Order kind"}</strong>
|
|
<span>{kind || "-"}</span>
|
|
</div>
|
|
<div>
|
|
<strong>{isZh ? "支付渠道" : "Provider"}</strong>
|
|
<span>{provider || "-"}</span>
|
|
</div>
|
|
</div>
|
|
<div className="table-row">
|
|
<div>
|
|
<strong>{isZh ? "交易号" : "Trade no"}</strong>
|
|
<span>{tradeNo || "-"}</span>
|
|
</div>
|
|
<div>
|
|
<strong>{isZh ? "状态" : "Status"}</strong>
|
|
<span>{isZh ? "成功" : "Success"}</span>
|
|
</div>
|
|
</div>
|
|
{matchedOrder ? (
|
|
<>
|
|
<div className="table-row">
|
|
<div>
|
|
<strong>{isZh ? "订单标题" : "Order title"}</strong>
|
|
<span>{String(matchedOrder.plan_title || matchedOrder.package_name || "-")}</span>
|
|
</div>
|
|
<div>
|
|
<strong>{isZh ? "金额" : "Amount"}</strong>
|
|
<span>{String(matchedOrder.money || "-")} {String(matchedOrder.currency || "")}</span>
|
|
</div>
|
|
</div>
|
|
<div className="table-row">
|
|
<div>
|
|
<strong>{isZh ? "支付方式" : "Payment method"}</strong>
|
|
<span>{String(matchedOrder.payment_method || "-")}</span>
|
|
</div>
|
|
<div>
|
|
<strong>{isZh ? "完成时间" : "Completed at"}</strong>
|
|
<span>{String(matchedOrder.complete_time || "-")}</span>
|
|
</div>
|
|
</div>
|
|
</>
|
|
) : null}
|
|
</div>
|
|
<div className="hero-actions">
|
|
<Link className="button button-dark" href={`/${locale}/billing`}>
|
|
{isZh ? "查看账单中心" : "Open billing"}
|
|
</Link>
|
|
<Link className="button button-light" href={`/${locale}/console`}>
|
|
{isZh ? "前往控制台" : "Open console"}
|
|
</Link>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
);
|
|
}
|
|
|